<script lang="ts">
export default {
  name: "xt-checkbox",
};
</script>

<script setup lang="ts">
import { ElCheckboxGroup, ElCheckbox } from "element-plus";
import Typings from "../../../typings";
interface Props extends /* @vue-ignore */ Typings.Checkbox.groupInstance {
  options: Typings.Common.option[];
  alias?: Typings.Common.alias;
}

const props = withDefaults(defineProps<Props>(), {
  options: () => [],
  alias: () => ({ code: "code", name: "name" }),
});
</script>

<template>
  <el-checkbox-group class="xt-checkbox">
    <el-checkbox
      v-for="{
        [props.alias['code']]: code,
        [props.alias['name']]: name,
        ...op
      } in options"
      :key="code"
      :value="code"
      :label="name"
      v-bind="op"
    />
  </el-checkbox-group>
</template>

<style lang="scss">
@use "../../../scss/xt-checkbox.scss";
</style>
